import './index.scss';
import React, { Component } from 'react'
import PageLayout from 'layouts/Page';

@PageLayout({classNames: 'page-service-process', title: '预约流程' })
class Page extends Component {
  componentDidMount() {
    //  默认关闭页面
    this.props.setHeader({
      onBack: () => {
        location.href = 'jzapp://close_web_page';
      }
    });
  }
  
  render() {
    let data = [
      {
        title: '咨询疫苗客服',
        para: '彩育客服将为您提供全程专业的疫苗咨询服务'
      },
      {
        title: '获取接种方案',
        para: '我们拥有国内外丰富的疫苗资源，将为您推荐最适合您的接种方案'
      },
      {
        title: '选购并下单',
        para: '选择适合您的疫苗，准确填写接种人信息，下单并支付'
      },
      {
        title: '与诊所预约时间',
        para: '下单成功后，诊所将通过APP或电话与您取得联系并确定接种时间'
      },{
        title: '线下核销并接种',
        para: '服务核销码是重要的接种凭证，请您妥善保管并在接种前提供给诊所服务人员'
      },{
        title: '本次接种完成',
        para: '如果是多针剂疫苗，请及时与诊所确定下一针的接种时间'
      }
    ]
    return (
      <div className="process">
      {
        data.map((item, index) => {
          return <div className="process-item" key={index}>
            <div className="number">{index+1}</div>
            <h2 className="title">{item.title}</h2>
            <p>{item.para}</p>
          </div>
        })
      }
      </div>
    );
  }
}

export default Page;